<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8"/>
  <title>IconFont Demo</title>
  <link rel="shortcut icon" href="https://gtms04.alicdn.com/tps/i4/TB1_oz6GVXXXXaFXpXXJDFnIXXX-64-64.ico" type="image/x-icon"/>
  <link rel="stylesheet" href="https://g.alicdn.com/thx/cube/1.3.2/cube.min.css">
  <link rel="stylesheet" href="demo.css">
  <link rel="stylesheet" href="iconfont.css">
  <script src="iconfont.js"></script>
  <!-- jQuery -->
  <script src="https://a1.alicdn.com/oss/uploads/2018/12/26/7bfddb60-08e8-11e9-9b04-53e73bb6408b.js"></script>
  <!-- 代码高亮 -->
  <script src="https://a1.alicdn.com/oss/uploads/2018/12/26/a3f714d0-08e6-11e9-8a15-ebf944d7534c.js"></script>
</head>
<body>
  <div class="main">
    <h1 class="logo"><a href="https://www.iconfont.cn/" title="iconfont 首页" target="_blank">&#xe86b;</a></h1>
    <div class="nav-tabs">
      <ul id="tabs" class="dib-box">
        <li class="dib active"><span>Unicode</span></li>
        <li class="dib"><span>Font class</span></li>
        <li class="dib"><span>Symbol</span></li>
      </ul>
      
      <a href="https://www.iconfont.cn/manage/index?manage_type=myprojects&projectId=966973" target="_blank" class="nav-more">查看项目</a>
      
    </div>
    <div class="tab-container">
      <div class="content unicode" style="display: block;">
          <ul class="icon_lists dib-box">
          
            <li class="dib">
              <span class="icon iconfont">&#xe61c;</span>
                <div class="name">大雨-天气</div>
                <div class="code-name">&amp;#xe61c;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe61d;</span>
                <div class="name">多云-天气</div>
                <div class="code-name">&amp;#xe61d;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe61e;</span>
                <div class="name">雷电-天气</div>
                <div class="code-name">&amp;#xe61e;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe61f;</span>
                <div class="name">晴-天气</div>
                <div class="code-name">&amp;#xe61f;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe622;</span>
                <div class="name">小雨-天气</div>
                <div class="code-name">&amp;#xe622;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe623;</span>
                <div class="name">雪-天气</div>
                <div class="code-name">&amp;#xe623;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe624;</span>
                <div class="name">阴天-天气</div>
                <div class="code-name">&amp;#xe624;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe65e;</span>
                <div class="name">审批</div>
                <div class="code-name">&amp;#xe65e;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe660;</span>
                <div class="name">密码重置</div>
                <div class="code-name">&amp;#xe660;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe661;</span>
                <div class="name">已经发布</div>
                <div class="code-name">&amp;#xe661;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe629;</span>
                <div class="name">数字0</div>
                <div class="code-name">&amp;#xe629;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe62a;</span>
                <div class="name">数字1</div>
                <div class="code-name">&amp;#xe62a;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe62b;</span>
                <div class="name">数字2</div>
                <div class="code-name">&amp;#xe62b;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe62e;</span>
                <div class="name">数字3</div>
                <div class="code-name">&amp;#xe62e;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe62f;</span>
                <div class="name">数字4</div>
                <div class="code-name">&amp;#xe62f;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe630;</span>
                <div class="name">数字5</div>
                <div class="code-name">&amp;#xe630;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe631;</span>
                <div class="name">数字6</div>
                <div class="code-name">&amp;#xe631;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe632;</span>
                <div class="name">数字7</div>
                <div class="code-name">&amp;#xe632;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe633;</span>
                <div class="name">数字8</div>
                <div class="code-name">&amp;#xe633;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe634;</span>
                <div class="name">数字9</div>
                <div class="code-name">&amp;#xe634;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe604;</span>
                <div class="name">成功</div>
                <div class="code-name">&amp;#xe604;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe606;</span>
                <div class="name">地址</div>
                <div class="code-name">&amp;#xe606;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe607;</span>
                <div class="name">点赞-b</div>
                <div class="code-name">&amp;#xe607;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe608;</span>
                <div class="name">点赞(激活)-b</div>
                <div class="code-name">&amp;#xe608;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe619;</span>
                <div class="name">热度</div>
                <div class="code-name">&amp;#xe619;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe62c;</span>
                <div class="name">no</div>
                <div class="code-name">&amp;#xe62c;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe62d;</span>
                <div class="name">ok</div>
                <div class="code-name">&amp;#xe62d;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe635;</span>
                <div class="name">审核通过</div>
                <div class="code-name">&amp;#xe635;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe636;</span>
                <div class="name">等待审核</div>
                <div class="code-name">&amp;#xe636;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe637;</span>
                <div class="name">等待授权</div>
                <div class="code-name">&amp;#xe637;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe638;</span>
                <div class="name">审核驳回</div>
                <div class="code-name">&amp;#xe638;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe639;</span>
                <div class="name">授权驳回</div>
                <div class="code-name">&amp;#xe639;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe686;</span>
                <div class="name">天气-暴雨转大暴雨</div>
                <div class="code-name">&amp;#xe686;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe687;</span>
                <div class="name">天气-暴雨</div>
                <div class="code-name">&amp;#xe687;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe688;</span>
                <div class="name">天气-大雪转暴雪</div>
                <div class="code-name">&amp;#xe688;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe689;</span>
                <div class="name">天气-大雪</div>
                <div class="code-name">&amp;#xe689;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe68a;</span>
                <div class="name">天气-大暴雨</div>
                <div class="code-name">&amp;#xe68a;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe68b;</span>
                <div class="name">天气-暴雪</div>
                <div class="code-name">&amp;#xe68b;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe68c;</span>
                <div class="name">天气-大雨</div>
                <div class="code-name">&amp;#xe68c;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe68d;</span>
                <div class="name">天气-风向</div>
                <div class="code-name">&amp;#xe68d;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe68e;</span>
                <div class="name">天气-多云</div>
                <div class="code-name">&amp;#xe68e;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe68f;</span>
                <div class="name">天气-大雨转暴雨</div>
                <div class="code-name">&amp;#xe68f;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe690;</span>
                <div class="name">天气-冻雨</div>
                <div class="code-name">&amp;#xe690;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe691;</span>
                <div class="name">天气-大雨转特大暴雨</div>
                <div class="code-name">&amp;#xe691;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe692;</span>
                <div class="name">天气-浮尘</div>
                <div class="code-name">&amp;#xe692;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe693;</span>
                <div class="name">天气-雷雨冰雹</div>
                <div class="code-name">&amp;#xe693;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe694;</span>
                <div class="name">天气-晴</div>
                <div class="code-name">&amp;#xe694;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe695;</span>
                <div class="name">天气-雷阵雨</div>
                <div class="code-name">&amp;#xe695;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe696;</span>
                <div class="name">天气-特大暴雨</div>
                <div class="code-name">&amp;#xe696;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe697;</span>
                <div class="name">天气-沙尘暴</div>
                <div class="code-name">&amp;#xe697;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe698;</span>
                <div class="name">天气-特大沙尘暴</div>
                <div class="code-name">&amp;#xe698;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe699;</span>
                <div class="name">天气-雾霾</div>
                <div class="code-name">&amp;#xe699;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe69a;</span>
                <div class="name">天气-雾</div>
                <div class="code-name">&amp;#xe69a;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe69b;</span>
                <div class="name">天气-小雪</div>
                <div class="code-name">&amp;#xe69b;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe69c;</span>
                <div class="name">天气-小雨</div>
                <div class="code-name">&amp;#xe69c;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe69d;</span>
                <div class="name">天气-小雪转中雪</div>
                <div class="code-name">&amp;#xe69d;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe69e;</span>
                <div class="name">天气-阴</div>
                <div class="code-name">&amp;#xe69e;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe69f;</span>
                <div class="name">天气-雪</div>
                <div class="code-name">&amp;#xe69f;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6a0;</span>
                <div class="name">天气-雨</div>
                <div class="code-name">&amp;#xe6a0;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6a1;</span>
                <div class="name">天气-小雨转中雨</div>
                <div class="code-name">&amp;#xe6a1;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6a2;</span>
                <div class="name">天气-雨夹雪</div>
                <div class="code-name">&amp;#xe6a2;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6a3;</span>
                <div class="name">天气-扬沙</div>
                <div class="code-name">&amp;#xe6a3;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6a4;</span>
                <div class="name">天气-阵雪</div>
                <div class="code-name">&amp;#xe6a4;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6a5;</span>
                <div class="name">天气-中雪</div>
                <div class="code-name">&amp;#xe6a5;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6a6;</span>
                <div class="name">天气-阵雨</div>
                <div class="code-name">&amp;#xe6a6;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6a7;</span>
                <div class="name">天气-中雨</div>
                <div class="code-name">&amp;#xe6a7;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6a8;</span>
                <div class="name">天气-中雪转大雪</div>
                <div class="code-name">&amp;#xe6a8;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6a9;</span>
                <div class="name">天气-中雨转大雨</div>
                <div class="code-name">&amp;#xe6a9;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xec65;</span>
                <div class="name">天气-6</div>
                <div class="code-name">&amp;#xec65;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6aa;</span>
                <div class="name">奖杯1-1</div>
                <div class="code-name">&amp;#xe6aa;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6ab;</span>
                <div class="name">奖杯1-2</div>
                <div class="code-name">&amp;#xe6ab;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6ac;</span>
                <div class="name">奖杯1-3</div>
                <div class="code-name">&amp;#xe6ac;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6ad;</span>
                <div class="name">奖杯2-1</div>
                <div class="code-name">&amp;#xe6ad;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6ae;</span>
                <div class="name">奖杯2-2</div>
                <div class="code-name">&amp;#xe6ae;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6af;</span>
                <div class="name">奖杯2-3</div>
                <div class="code-name">&amp;#xe6af;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6b0;</span>
                <div class="name">奖杯3-1</div>
                <div class="code-name">&amp;#xe6b0;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6b1;</span>
                <div class="name">奖杯3-2</div>
                <div class="code-name">&amp;#xe6b1;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6b2;</span>
                <div class="name">奖杯3-3</div>
                <div class="code-name">&amp;#xe6b2;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6b3;</span>
                <div class="name">奖杯4-1</div>
                <div class="code-name">&amp;#xe6b3;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6b4;</span>
                <div class="name">奖杯4-2</div>
                <div class="code-name">&amp;#xe6b4;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6b5;</span>
                <div class="name">奖杯4-3</div>
                <div class="code-name">&amp;#xe6b5;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6b6;</span>
                <div class="name">奖杯5-1</div>
                <div class="code-name">&amp;#xe6b6;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6b7;</span>
                <div class="name">奖杯5-2</div>
                <div class="code-name">&amp;#xe6b7;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6b8;</span>
                <div class="name">奖杯5-3</div>
                <div class="code-name">&amp;#xe6b8;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6b9;</span>
                <div class="name">奖杯6-1</div>
                <div class="code-name">&amp;#xe6b9;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6ba;</span>
                <div class="name">奖杯6-2</div>
                <div class="code-name">&amp;#xe6ba;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6bb;</span>
                <div class="name">奖杯6-3</div>
                <div class="code-name">&amp;#xe6bb;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6bc;</span>
                <div class="name">奖杯7-1</div>
                <div class="code-name">&amp;#xe6bc;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6bd;</span>
                <div class="name">奖杯7-2</div>
                <div class="code-name">&amp;#xe6bd;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe6be;</span>
                <div class="name">奖杯7-3</div>
                <div class="code-name">&amp;#xe6be;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe646;</span>
                <div class="name">AI图标</div>
                <div class="code-name">&amp;#xe646;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe647;</span>
                <div class="name">GIF图标</div>
                <div class="code-name">&amp;#xe647;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe648;</span>
                <div class="name">doc图标</div>
                <div class="code-name">&amp;#xe648;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe649;</span>
                <div class="name">bmp图标</div>
                <div class="code-name">&amp;#xe649;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe64a;</span>
                <div class="name">AVI图标</div>
                <div class="code-name">&amp;#xe64a;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe64b;</span>
                <div class="name">mov图标</div>
                <div class="code-name">&amp;#xe64b;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe64c;</span>
                <div class="name">MP4图标</div>
                <div class="code-name">&amp;#xe64c;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe64d;</span>
                <div class="name">pdf图标</div>
                <div class="code-name">&amp;#xe64d;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe64e;</span>
                <div class="name">PR图标</div>
                <div class="code-name">&amp;#xe64e;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe64f;</span>
                <div class="name">html图标</div>
                <div class="code-name">&amp;#xe64f;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe650;</span>
                <div class="name">psd图标</div>
                <div class="code-name">&amp;#xe650;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe651;</span>
                <div class="name">RAR图标</div>
                <div class="code-name">&amp;#xe651;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe652;</span>
                <div class="name">MP3图标</div>
                <div class="code-name">&amp;#xe652;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe653;</span>
                <div class="name">ppt图标</div>
                <div class="code-name">&amp;#xe653;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe654;</span>
                <div class="name">TIF图标</div>
                <div class="code-name">&amp;#xe654;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe655;</span>
                <div class="name">CDR图标</div>
                <div class="code-name">&amp;#xe655;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe656;</span>
                <div class="name">svg图标</div>
                <div class="code-name">&amp;#xe656;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe657;</span>
                <div class="name">EPS图标</div>
                <div class="code-name">&amp;#xe657;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe658;</span>
                <div class="name">EXE图标</div>
                <div class="code-name">&amp;#xe658;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe659;</span>
                <div class="name">ZIP图标</div>
                <div class="code-name">&amp;#xe659;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe736;</span>
                <div class="name">啊</div>
                <div class="code-name">&amp;#xe736;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe737;</span>
                <div class="name">闭嘴</div>
                <div class="code-name">&amp;#xe737;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe738;</span>
                <div class="name">白眼</div>
                <div class="code-name">&amp;#xe738;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe739;</span>
                <div class="name">爱心</div>
                <div class="code-name">&amp;#xe739;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe73a;</span>
                <div class="name">大惊</div>
                <div class="code-name">&amp;#xe73a;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe73b;</span>
                <div class="name">呲牙</div>
                <div class="code-name">&amp;#xe73b;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe73c;</span>
                <div class="name">大笑</div>
                <div class="code-name">&amp;#xe73c;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe73d;</span>
                <div class="name">饿死</div>
                <div class="code-name">&amp;#xe73d;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe73e;</span>
                <div class="name">发呆</div>
                <div class="code-name">&amp;#xe73e;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe73f;</span>
                <div class="name">犯困</div>
                <div class="code-name">&amp;#xe73f;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe740;</span>
                <div class="name">尴尬</div>
                <div class="code-name">&amp;#xe740;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe741;</span>
                <div class="name">愤怒</div>
                <div class="code-name">&amp;#xe741;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe742;</span>
                <div class="name">汗颜</div>
                <div class="code-name">&amp;#xe742;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe743;</span>
                <div class="name">惊恐</div>
                <div class="code-name">&amp;#xe743;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe744;</span>
                <div class="name">好吃</div>
                <div class="code-name">&amp;#xe744;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe745;</span>
                <div class="name">恶魔</div>
                <div class="code-name">&amp;#xe745;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe746;</span>
                <div class="name">惊悚</div>
                <div class="code-name">&amp;#xe746;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe747;</span>
                <div class="name">惊讶</div>
                <div class="code-name">&amp;#xe747;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe748;</span>
                <div class="name">开心</div>
                <div class="code-name">&amp;#xe748;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe749;</span>
                <div class="name">冷酷</div>
                <div class="code-name">&amp;#xe749;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe74a;</span>
                <div class="name">大闹</div>
                <div class="code-name">&amp;#xe74a;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe74b;</span>
                <div class="name">流口水</div>
                <div class="code-name">&amp;#xe74b;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe74c;</span>
                <div class="name">流泪</div>
                <div class="code-name">&amp;#xe74c;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe74d;</span>
                <div class="name">懵逼</div>
                <div class="code-name">&amp;#xe74d;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe74e;</span>
                <div class="name">面无表情</div>
                <div class="code-name">&amp;#xe74e;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe74f;</span>
                <div class="name">难过</div>
                <div class="code-name">&amp;#xe74f;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe750;</span>
                <div class="name">睡着</div>
                <div class="code-name">&amp;#xe750;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe751;</span>
                <div class="name">讨厌</div>
                <div class="code-name">&amp;#xe751;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe752;</span>
                <div class="name">贪吃</div>
                <div class="code-name">&amp;#xe752;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe753;</span>
                <div class="name">死了</div>
                <div class="code-name">&amp;#xe753;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe754;</span>
                <div class="name">调皮</div>
                <div class="code-name">&amp;#xe754;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe755;</span>
                <div class="name">笑出泪</div>
                <div class="code-name">&amp;#xe755;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe756;</span>
                <div class="name">无聊</div>
                <div class="code-name">&amp;#xe756;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe757;</span>
                <div class="name">星星眼</div>
                <div class="code-name">&amp;#xe757;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe758;</span>
                <div class="name">斜眼</div>
                <div class="code-name">&amp;#xe758;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe759;</span>
                <div class="name">吓死</div>
                <div class="code-name">&amp;#xe759;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe75a;</span>
                <div class="name">笑脸</div>
                <div class="code-name">&amp;#xe75a;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe60d;</span>
                <div class="name">晴天</div>
                <div class="code-name">&amp;#xe60d;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe60e;</span>
                <div class="name">沙尘暴</div>
                <div class="code-name">&amp;#xe60e;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe60f;</span>
                <div class="name">多云</div>
                <div class="code-name">&amp;#xe60f;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe610;</span>
                <div class="name">小雨</div>
                <div class="code-name">&amp;#xe610;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe611;</span>
                <div class="name">阴天</div>
                <div class="code-name">&amp;#xe611;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe612;</span>
                <div class="name">闪电</div>
                <div class="code-name">&amp;#xe612;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe613;</span>
                <div class="name">月亮</div>
                <div class="code-name">&amp;#xe613;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe614;</span>
                <div class="name">雾</div>
                <div class="code-name">&amp;#xe614;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe615;</span>
                <div class="name">太阳雨</div>
                <div class="code-name">&amp;#xe615;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe616;</span>
                <div class="name">彩虹</div>
                <div class="code-name">&amp;#xe616;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe617;</span>
                <div class="name">冰雹</div>
                <div class="code-name">&amp;#xe617;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe618;</span>
                <div class="name">大雪</div>
                <div class="code-name">&amp;#xe618;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe61a;</span>
                <div class="name">小雪</div>
                <div class="code-name">&amp;#xe61a;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe61b;</span>
                <div class="name">晴天</div>
                <div class="code-name">&amp;#xe61b;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe620;</span>
                <div class="name">晴天</div>
                <div class="code-name">&amp;#xe620;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe621;</span>
                <div class="name">大雨</div>
                <div class="code-name">&amp;#xe621;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe625;</span>
                <div class="name">中雨</div>
                <div class="code-name">&amp;#xe625;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe626;</span>
                <div class="name">雾霾</div>
                <div class="code-name">&amp;#xe626;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe627;</span>
                <div class="name">夜空</div>
                <div class="code-name">&amp;#xe627;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe628;</span>
                <div class="name">龙卷风</div>
                <div class="code-name">&amp;#xe628;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe75b;</span>
                <div class="name">酷</div>
                <div class="code-name">&amp;#xe75b;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe75c;</span>
                <div class="name">生气</div>
                <div class="code-name">&amp;#xe75c;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe75d;</span>
                <div class="name">又死了</div>
                <div class="code-name">&amp;#xe75d;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe75e;</span>
                <div class="name">恩~</div>
                <div class="code-name">&amp;#xe75e;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe75f;</span>
                <div class="name">不舒服</div>
                <div class="code-name">&amp;#xe75f;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe760;</span>
                <div class="name">便便</div>
                <div class="code-name">&amp;#xe760;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe761;</span>
                <div class="name">犯困</div>
                <div class="code-name">&amp;#xe761;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe762;</span>
                <div class="name">飞吻</div>
                <div class="code-name">&amp;#xe762;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe763;</span>
                <div class="name">感冒</div>
                <div class="code-name">&amp;#xe763;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe764;</span>
                <div class="name">坏笑</div>
                <div class="code-name">&amp;#xe764;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe765;</span>
                <div class="name">流汗</div>
                <div class="code-name">&amp;#xe765;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe766;</span>
                <div class="name">呕吐</div>
                <div class="code-name">&amp;#xe766;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe767;</span>
                <div class="name">瞌睡</div>
                <div class="code-name">&amp;#xe767;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe768;</span>
                <div class="name">忍者</div>
                <div class="code-name">&amp;#xe768;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe769;</span>
                <div class="name">三条线</div>
                <div class="code-name">&amp;#xe769;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe76a;</span>
                <div class="name">怪物</div>
                <div class="code-name">&amp;#xe76a;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe76b;</span>
                <div class="name">受伤</div>
                <div class="code-name">&amp;#xe76b;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe76c;</span>
                <div class="name">天使</div>
                <div class="code-name">&amp;#xe76c;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe76d;</span>
                <div class="name">衰</div>
                <div class="code-name">&amp;#xe76d;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe76e;</span>
                <div class="name">献吻</div>
                <div class="code-name">&amp;#xe76e;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe76f;</span>
                <div class="name">笑掉大牙</div>
                <div class="code-name">&amp;#xe76f;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe770;</span>
                <div class="name">凶</div>
                <div class="code-name">&amp;#xe770;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe771;</span>
                <div class="name">疑问</div>
                <div class="code-name">&amp;#xe771;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe772;</span>
                <div class="name">晕</div>
                <div class="code-name">&amp;#xe772;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe773;</span>
                <div class="name">流鼻血</div>
                <div class="code-name">&amp;#xe773;</div>
              </li>
          
            <li class="dib">
              <span class="icon iconfont">&#xe774;</span>
                <div class="name">什么</div>
                <div class="code-name">&amp;#xe774;</div>
              </li>
          
          </ul>
          <div class="article markdown">
          <h2 id="unicode-">Unicode 引用</h2>
          <hr>

          <p>Unicode 是字体在网页端最原始的应用方式，特点是：</p>
          <ul>
            <li>兼容性最好，支持 IE6+，及所有现代浏览器。</li>
            <li>支持按字体的方式去动态调整图标大小，颜色等等。</li>
            <li>但是因为是字体，所以不支持多色。只能使用平台里单色的图标，就算项目里有多色图标也会自动去色。</li>
          </ul>
          <blockquote>
            <p>注意：新版 iconfont 支持多色图标，这些多色图标在 Unicode 模式下将不能使用，如果有需求建议使用symbol 的引用方式</p>
          </blockquote>
          <p>Unicode 使用步骤如下：</p>
          <h3 id="-font-face">第一步：拷贝项目下面生成的 <code>@font-face</code></h3>
<pre><code class="language-css"
>@font-face {
  font-family: 'iconfont';
  src: url('iconfont.eot');
  src: url('iconfont.eot?#iefix') format('embedded-opentype'),
      url('iconfont.woff2') format('woff2'),
      url('iconfont.woff') format('woff'),
      url('iconfont.ttf') format('truetype'),
      url('iconfont.svg#iconfont') format('svg');
}
</code></pre>
          <h3 id="-iconfont-">第二步：定义使用 iconfont 的样式</h3>
<pre><code class="language-css"
>.iconfont {
  font-family: "iconfont" !important;
  font-size: 16px;
  font-style: normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
</code></pre>
          <h3 id="-">第三步：挑选相应图标并获取字体编码，应用于页面</h3>
<pre>
<code class="language-html"
>&lt;span class="iconfont"&gt;&amp;#x33;&lt;/span&gt;
</code></pre>
          <blockquote>
            <p>"iconfont" 是你项目下的 font-family。可以通过编辑项目查看，默认是 "iconfont"。</p>
          </blockquote>
          </div>
      </div>
      <div class="content font-class">
        <ul class="icon_lists dib-box">
          
          <li class="dib">
            <span class="icon iconfont icon-dayu"></span>
            <div class="name">
              大雨-天气
            </div>
            <div class="code-name">.icon-dayu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-duoyun"></span>
            <div class="name">
              多云-天气
            </div>
            <div class="code-name">.icon-duoyun
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-leidian"></span>
            <div class="name">
              雷电-天气
            </div>
            <div class="code-name">.icon-leidian
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-qing"></span>
            <div class="name">
              晴-天气
            </div>
            <div class="code-name">.icon-qing
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-xiaoyu"></span>
            <div class="name">
              小雨-天气
            </div>
            <div class="code-name">.icon-xiaoyu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-xue"></span>
            <div class="name">
              雪-天气
            </div>
            <div class="code-name">.icon-xue
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-yintian"></span>
            <div class="name">
              阴天-天气
            </div>
            <div class="code-name">.icon-yintian
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-shenpi"></span>
            <div class="name">
              审批
            </div>
            <div class="code-name">.icon-shenpi
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mimazhongzhi"></span>
            <div class="name">
              密码重置
            </div>
            <div class="code-name">.icon-mimazhongzhi
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-yijingfabu"></span>
            <div class="name">
              已经发布
            </div>
            <div class="code-name">.icon-yijingfabu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-shuzi0"></span>
            <div class="name">
              数字0
            </div>
            <div class="code-name">.icon-shuzi0
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-shuzi1"></span>
            <div class="name">
              数字1
            </div>
            <div class="code-name">.icon-shuzi1
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-shuzi2"></span>
            <div class="name">
              数字2
            </div>
            <div class="code-name">.icon-shuzi2
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-shuzi3"></span>
            <div class="name">
              数字3
            </div>
            <div class="code-name">.icon-shuzi3
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-shuzi4"></span>
            <div class="name">
              数字4
            </div>
            <div class="code-name">.icon-shuzi4
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-shuzi5"></span>
            <div class="name">
              数字5
            </div>
            <div class="code-name">.icon-shuzi5
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-shuzi6"></span>
            <div class="name">
              数字6
            </div>
            <div class="code-name">.icon-shuzi6
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-shuzi7"></span>
            <div class="name">
              数字7
            </div>
            <div class="code-name">.icon-shuzi7
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-shuzi8"></span>
            <div class="name">
              数字8
            </div>
            <div class="code-name">.icon-shuzi8
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-shuzi9"></span>
            <div class="name">
              数字9
            </div>
            <div class="code-name">.icon-shuzi9
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-chenggong"></span>
            <div class="name">
              成功
            </div>
            <div class="code-name">.icon-chenggong
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-dizhi"></span>
            <div class="name">
              地址
            </div>
            <div class="code-name">.icon-dizhi
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-dianzanb"></span>
            <div class="name">
              点赞-b
            </div>
            <div class="code-name">.icon-dianzanb
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-dianzanjihuob"></span>
            <div class="name">
              点赞(激活)-b
            </div>
            <div class="code-name">.icon-dianzanjihuob
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-redu"></span>
            <div class="name">
              热度
            </div>
            <div class="code-name">.icon-redu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-no"></span>
            <div class="name">
              no
            </div>
            <div class="code-name">.icon-no
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-ok"></span>
            <div class="name">
              ok
            </div>
            <div class="code-name">.icon-ok
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-pass-2-copy"></span>
            <div class="name">
              审核通过
            </div>
            <div class="code-name">.icon-pass-2-copy
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-dengdaishenhe"></span>
            <div class="name">
              等待审核
            </div>
            <div class="code-name">.icon-dengdaishenhe
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-dengdaishouquan"></span>
            <div class="name">
              等待授权
            </div>
            <div class="code-name">.icon-dengdaishouquan
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-shenhebohui"></span>
            <div class="name">
              审核驳回
            </div>
            <div class="code-name">.icon-shenhebohui
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-shouquanbohui"></span>
            <div class="name">
              授权驳回
            </div>
            <div class="code-name">.icon-shouquanbohui
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-tianqi-baoyuzhuandabaoyu"></span>
            <div class="name">
              天气-暴雨转大暴雨
            </div>
            <div class="code-name">.icon-tianqi-baoyuzhuandabaoyu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-tianqi-baoyu"></span>
            <div class="name">
              天气-暴雨
            </div>
            <div class="code-name">.icon-tianqi-baoyu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-tianqi-daxuezhuanbaoxue"></span>
            <div class="name">
              天气-大雪转暴雪
            </div>
            <div class="code-name">.icon-tianqi-daxuezhuanbaoxue
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-tianqi-daxue"></span>
            <div class="name">
              天气-大雪
            </div>
            <div class="code-name">.icon-tianqi-daxue
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-tianqi-dabaoyu"></span>
            <div class="name">
              天气-大暴雨
            </div>
            <div class="code-name">.icon-tianqi-dabaoyu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-tianqi-baoxue"></span>
            <div class="name">
              天气-暴雪
            </div>
            <div class="code-name">.icon-tianqi-baoxue
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-tianqi-dayu"></span>
            <div class="name">
              天气-大雨
            </div>
            <div class="code-name">.icon-tianqi-dayu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-tianqi-fengxiang"></span>
            <div class="name">
              天气-风向
            </div>
            <div class="code-name">.icon-tianqi-fengxiang
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-tianqi-duoyun"></span>
            <div class="name">
              天气-多云
            </div>
            <div class="code-name">.icon-tianqi-duoyun
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-tianqi-dayuzhuanbaoyu"></span>
            <div class="name">
              天气-大雨转暴雨
            </div>
            <div class="code-name">.icon-tianqi-dayuzhuanbaoyu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-tianqi-dongyu"></span>
            <div class="name">
              天气-冻雨
            </div>
            <div class="code-name">.icon-tianqi-dongyu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-tianqi-dayuzhuantedabaoyu"></span>
            <div class="name">
              天气-大雨转特大暴雨
            </div>
            <div class="code-name">.icon-tianqi-dayuzhuantedabaoyu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-tianqi-fuchen"></span>
            <div class="name">
              天气-浮尘
            </div>
            <div class="code-name">.icon-tianqi-fuchen
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-tianqi-leiyubingbao"></span>
            <div class="name">
              天气-雷雨冰雹
            </div>
            <div class="code-name">.icon-tianqi-leiyubingbao
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-tianqi-qing"></span>
            <div class="name">
              天气-晴
            </div>
            <div class="code-name">.icon-tianqi-qing
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-tianqi-leizhenyu"></span>
            <div class="name">
              天气-雷阵雨
            </div>
            <div class="code-name">.icon-tianqi-leizhenyu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-tianqi-tedabaoyu"></span>
            <div class="name">
              天气-特大暴雨
            </div>
            <div class="code-name">.icon-tianqi-tedabaoyu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-tianqi-shachenbao"></span>
            <div class="name">
              天气-沙尘暴
            </div>
            <div class="code-name">.icon-tianqi-shachenbao
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-tianqi-tedashachenbao"></span>
            <div class="name">
              天气-特大沙尘暴
            </div>
            <div class="code-name">.icon-tianqi-tedashachenbao
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-tianqi-wumai"></span>
            <div class="name">
              天气-雾霾
            </div>
            <div class="code-name">.icon-tianqi-wumai
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-tianqi-wu"></span>
            <div class="name">
              天气-雾
            </div>
            <div class="code-name">.icon-tianqi-wu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-tianqi-xiaoxue"></span>
            <div class="name">
              天气-小雪
            </div>
            <div class="code-name">.icon-tianqi-xiaoxue
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-tianqi-xiaoyu"></span>
            <div class="name">
              天气-小雨
            </div>
            <div class="code-name">.icon-tianqi-xiaoyu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-tianqi-xiaoxuezhuanzhongxue"></span>
            <div class="name">
              天气-小雪转中雪
            </div>
            <div class="code-name">.icon-tianqi-xiaoxuezhuanzhongxue
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-tianqi-yin"></span>
            <div class="name">
              天气-阴
            </div>
            <div class="code-name">.icon-tianqi-yin
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-tianqi-xue"></span>
            <div class="name">
              天气-雪
            </div>
            <div class="code-name">.icon-tianqi-xue
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-tianqi-yu"></span>
            <div class="name">
              天气-雨
            </div>
            <div class="code-name">.icon-tianqi-yu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-tianqi-xiaoyuzhuanzhongyu"></span>
            <div class="name">
              天气-小雨转中雨
            </div>
            <div class="code-name">.icon-tianqi-xiaoyuzhuanzhongyu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-tianqi-yujiaxue"></span>
            <div class="name">
              天气-雨夹雪
            </div>
            <div class="code-name">.icon-tianqi-yujiaxue
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-tianqi-yangsha"></span>
            <div class="name">
              天气-扬沙
            </div>
            <div class="code-name">.icon-tianqi-yangsha
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-tianqi-zhenxue"></span>
            <div class="name">
              天气-阵雪
            </div>
            <div class="code-name">.icon-tianqi-zhenxue
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-tianqi-zhongxue"></span>
            <div class="name">
              天气-中雪
            </div>
            <div class="code-name">.icon-tianqi-zhongxue
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-tianqi-zhenyu"></span>
            <div class="name">
              天气-阵雨
            </div>
            <div class="code-name">.icon-tianqi-zhenyu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-tianqi-zhongyu"></span>
            <div class="name">
              天气-中雨
            </div>
            <div class="code-name">.icon-tianqi-zhongyu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-tianqi-zhongxuezhuandaxue"></span>
            <div class="name">
              天气-中雪转大雪
            </div>
            <div class="code-name">.icon-tianqi-zhongxuezhuandaxue
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-tianqi-zhongyuzhuandayu"></span>
            <div class="name">
              天气-中雨转大雨
            </div>
            <div class="code-name">.icon-tianqi-zhongyuzhuandayu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-tianqi-"></span>
            <div class="name">
              天气-6
            </div>
            <div class="code-name">.icon-tianqi-
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-jiangbei-"></span>
            <div class="name">
              奖杯1-1
            </div>
            <div class="code-name">.icon-jiangbei-
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-jiangbei-1"></span>
            <div class="name">
              奖杯1-2
            </div>
            <div class="code-name">.icon-jiangbei-1
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-jiangbei-2"></span>
            <div class="name">
              奖杯1-3
            </div>
            <div class="code-name">.icon-jiangbei-2
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-jiangbei-3"></span>
            <div class="name">
              奖杯2-1
            </div>
            <div class="code-name">.icon-jiangbei-3
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-jiangbei-4"></span>
            <div class="name">
              奖杯2-2
            </div>
            <div class="code-name">.icon-jiangbei-4
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-jiangbei-5"></span>
            <div class="name">
              奖杯2-3
            </div>
            <div class="code-name">.icon-jiangbei-5
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-jiangbei-6"></span>
            <div class="name">
              奖杯3-1
            </div>
            <div class="code-name">.icon-jiangbei-6
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-jiangbei-7"></span>
            <div class="name">
              奖杯3-2
            </div>
            <div class="code-name">.icon-jiangbei-7
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-jiangbei-8"></span>
            <div class="name">
              奖杯3-3
            </div>
            <div class="code-name">.icon-jiangbei-8
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-jiangbei-9"></span>
            <div class="name">
              奖杯4-1
            </div>
            <div class="code-name">.icon-jiangbei-9
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-jiangbei-10"></span>
            <div class="name">
              奖杯4-2
            </div>
            <div class="code-name">.icon-jiangbei-10
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-jiangbei-11"></span>
            <div class="name">
              奖杯4-3
            </div>
            <div class="code-name">.icon-jiangbei-11
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-jiangbei-12"></span>
            <div class="name">
              奖杯5-1
            </div>
            <div class="code-name">.icon-jiangbei-12
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-jiangbei-13"></span>
            <div class="name">
              奖杯5-2
            </div>
            <div class="code-name">.icon-jiangbei-13
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-jiangbei-14"></span>
            <div class="name">
              奖杯5-3
            </div>
            <div class="code-name">.icon-jiangbei-14
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-jiangbei-15"></span>
            <div class="name">
              奖杯6-1
            </div>
            <div class="code-name">.icon-jiangbei-15
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-jiangbei-16"></span>
            <div class="name">
              奖杯6-2
            </div>
            <div class="code-name">.icon-jiangbei-16
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-jiangbei-17"></span>
            <div class="name">
              奖杯6-3
            </div>
            <div class="code-name">.icon-jiangbei-17
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-jiangbei-18"></span>
            <div class="name">
              奖杯7-1
            </div>
            <div class="code-name">.icon-jiangbei-18
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-jiangbei-19"></span>
            <div class="name">
              奖杯7-2
            </div>
            <div class="code-name">.icon-jiangbei-19
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-jiangbei-20"></span>
            <div class="name">
              奖杯7-3
            </div>
            <div class="code-name">.icon-jiangbei-20
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-AItubiao"></span>
            <div class="name">
              AI图标
            </div>
            <div class="code-name">.icon-AItubiao
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-GIFtubiao"></span>
            <div class="name">
              GIF图标
            </div>
            <div class="code-name">.icon-GIFtubiao
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-doctubiao"></span>
            <div class="name">
              doc图标
            </div>
            <div class="code-name">.icon-doctubiao
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-bmptubiao"></span>
            <div class="name">
              bmp图标
            </div>
            <div class="code-name">.icon-bmptubiao
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-AVItubiao"></span>
            <div class="name">
              AVI图标
            </div>
            <div class="code-name">.icon-AVItubiao
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-movtubiao"></span>
            <div class="name">
              mov图标
            </div>
            <div class="code-name">.icon-movtubiao
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-MPtubiao"></span>
            <div class="name">
              MP4图标
            </div>
            <div class="code-name">.icon-MPtubiao
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-pdftubiao"></span>
            <div class="name">
              pdf图标
            </div>
            <div class="code-name">.icon-pdftubiao
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-PRtubiao"></span>
            <div class="name">
              PR图标
            </div>
            <div class="code-name">.icon-PRtubiao
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-htmltubiao"></span>
            <div class="name">
              html图标
            </div>
            <div class="code-name">.icon-htmltubiao
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-psdtubiao"></span>
            <div class="name">
              psd图标
            </div>
            <div class="code-name">.icon-psdtubiao
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-RARtubiao"></span>
            <div class="name">
              RAR图标
            </div>
            <div class="code-name">.icon-RARtubiao
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-MPtubiao1"></span>
            <div class="name">
              MP3图标
            </div>
            <div class="code-name">.icon-MPtubiao1
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-ppttubiao"></span>
            <div class="name">
              ppt图标
            </div>
            <div class="code-name">.icon-ppttubiao
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-TIFtubiao"></span>
            <div class="name">
              TIF图标
            </div>
            <div class="code-name">.icon-TIFtubiao
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-CDRtubiao"></span>
            <div class="name">
              CDR图标
            </div>
            <div class="code-name">.icon-CDRtubiao
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-svgtubiao"></span>
            <div class="name">
              svg图标
            </div>
            <div class="code-name">.icon-svgtubiao
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-EPStubiao"></span>
            <div class="name">
              EPS图标
            </div>
            <div class="code-name">.icon-EPStubiao
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-EXEtubiao"></span>
            <div class="name">
              EXE图标
            </div>
            <div class="code-name">.icon-EXEtubiao
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-ZIPtubiao"></span>
            <div class="name">
              ZIP图标
            </div>
            <div class="code-name">.icon-ZIPtubiao
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-a"></span>
            <div class="name">
              啊
            </div>
            <div class="code-name">.icon-a
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-bizui"></span>
            <div class="name">
              闭嘴
            </div>
            <div class="code-name">.icon-bizui
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-baiyan"></span>
            <div class="name">
              白眼
            </div>
            <div class="code-name">.icon-baiyan
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-aixin"></span>
            <div class="name">
              爱心
            </div>
            <div class="code-name">.icon-aixin
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-dajing"></span>
            <div class="name">
              大惊
            </div>
            <div class="code-name">.icon-dajing
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-ziya"></span>
            <div class="name">
              呲牙
            </div>
            <div class="code-name">.icon-ziya
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-daxiao"></span>
            <div class="name">
              大笑
            </div>
            <div class="code-name">.icon-daxiao
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-esi"></span>
            <div class="name">
              饿死
            </div>
            <div class="code-name">.icon-esi
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-fadai"></span>
            <div class="name">
              发呆
            </div>
            <div class="code-name">.icon-fadai
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-fankun"></span>
            <div class="name">
              犯困
            </div>
            <div class="code-name">.icon-fankun
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-ganga"></span>
            <div class="name">
              尴尬
            </div>
            <div class="code-name">.icon-ganga
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-fennu"></span>
            <div class="name">
              愤怒
            </div>
            <div class="code-name">.icon-fennu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-hanyan"></span>
            <div class="name">
              汗颜
            </div>
            <div class="code-name">.icon-hanyan
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-jingkong"></span>
            <div class="name">
              惊恐
            </div>
            <div class="code-name">.icon-jingkong
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-haochi"></span>
            <div class="name">
              好吃
            </div>
            <div class="code-name">.icon-haochi
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-emo"></span>
            <div class="name">
              恶魔
            </div>
            <div class="code-name">.icon-emo
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-jingsong"></span>
            <div class="name">
              惊悚
            </div>
            <div class="code-name">.icon-jingsong
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-jingya"></span>
            <div class="name">
              惊讶
            </div>
            <div class="code-name">.icon-jingya
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-kaixin"></span>
            <div class="name">
              开心
            </div>
            <div class="code-name">.icon-kaixin
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-lengku"></span>
            <div class="name">
              冷酷
            </div>
            <div class="code-name">.icon-lengku
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-danao"></span>
            <div class="name">
              大闹
            </div>
            <div class="code-name">.icon-danao
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-liukoushui"></span>
            <div class="name">
              流口水
            </div>
            <div class="code-name">.icon-liukoushui
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-liulei"></span>
            <div class="name">
              流泪
            </div>
            <div class="code-name">.icon-liulei
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mengbi"></span>
            <div class="name">
              懵逼
            </div>
            <div class="code-name">.icon-mengbi
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-mianwubiaoqing"></span>
            <div class="name">
              面无表情
            </div>
            <div class="code-name">.icon-mianwubiaoqing
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-nanguo"></span>
            <div class="name">
              难过
            </div>
            <div class="code-name">.icon-nanguo
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-shuizhuo"></span>
            <div class="name">
              睡着
            </div>
            <div class="code-name">.icon-shuizhuo
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-taoyan"></span>
            <div class="name">
              讨厌
            </div>
            <div class="code-name">.icon-taoyan
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-tanchi"></span>
            <div class="name">
              贪吃
            </div>
            <div class="code-name">.icon-tanchi
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-siliao"></span>
            <div class="name">
              死了
            </div>
            <div class="code-name">.icon-siliao
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-tiaopi"></span>
            <div class="name">
              调皮
            </div>
            <div class="code-name">.icon-tiaopi
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-xiaochulei"></span>
            <div class="name">
              笑出泪
            </div>
            <div class="code-name">.icon-xiaochulei
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-wuliao"></span>
            <div class="name">
              无聊
            </div>
            <div class="code-name">.icon-wuliao
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-xingxingyan"></span>
            <div class="name">
              星星眼
            </div>
            <div class="code-name">.icon-xingxingyan
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-xieyan"></span>
            <div class="name">
              斜眼
            </div>
            <div class="code-name">.icon-xieyan
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-xiasi"></span>
            <div class="name">
              吓死
            </div>
            <div class="code-name">.icon-xiasi
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-xiaolian"></span>
            <div class="name">
              笑脸
            </div>
            <div class="code-name">.icon-xiaolian
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-tianqitubiao-"></span>
            <div class="name">
              晴天
            </div>
            <div class="code-name">.icon-tianqitubiao-
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-tianqitubiao-1"></span>
            <div class="name">
              沙尘暴
            </div>
            <div class="code-name">.icon-tianqitubiao-1
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-tianqitubiao-2"></span>
            <div class="name">
              多云
            </div>
            <div class="code-name">.icon-tianqitubiao-2
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-tianqitubiao-3"></span>
            <div class="name">
              小雨
            </div>
            <div class="code-name">.icon-tianqitubiao-3
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-tianqitubiao-4"></span>
            <div class="name">
              阴天
            </div>
            <div class="code-name">.icon-tianqitubiao-4
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-tianqitubiao-5"></span>
            <div class="name">
              闪电
            </div>
            <div class="code-name">.icon-tianqitubiao-5
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-tianqitubiao-6"></span>
            <div class="name">
              月亮
            </div>
            <div class="code-name">.icon-tianqitubiao-6
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-tianqitubiao-7"></span>
            <div class="name">
              雾
            </div>
            <div class="code-name">.icon-tianqitubiao-7
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-tianqitubiao-8"></span>
            <div class="name">
              太阳雨
            </div>
            <div class="code-name">.icon-tianqitubiao-8
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-tianqitubiao-9"></span>
            <div class="name">
              彩虹
            </div>
            <div class="code-name">.icon-tianqitubiao-9
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-tianqitubiao-10"></span>
            <div class="name">
              冰雹
            </div>
            <div class="code-name">.icon-tianqitubiao-10
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-tianqitubiao-11"></span>
            <div class="name">
              大雪
            </div>
            <div class="code-name">.icon-tianqitubiao-11
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-tianqitubiao-12"></span>
            <div class="name">
              小雪
            </div>
            <div class="code-name">.icon-tianqitubiao-12
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-tianqitubiao-13"></span>
            <div class="name">
              晴天
            </div>
            <div class="code-name">.icon-tianqitubiao-13
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-tianqitubiao-14"></span>
            <div class="name">
              晴天
            </div>
            <div class="code-name">.icon-tianqitubiao-14
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-tianqitubiao-15"></span>
            <div class="name">
              大雨
            </div>
            <div class="code-name">.icon-tianqitubiao-15
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-tianqitubiao-16"></span>
            <div class="name">
              中雨
            </div>
            <div class="code-name">.icon-tianqitubiao-16
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-tianqitubiao-17"></span>
            <div class="name">
              雾霾
            </div>
            <div class="code-name">.icon-tianqitubiao-17
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-tianqitubiao-18"></span>
            <div class="name">
              夜空
            </div>
            <div class="code-name">.icon-tianqitubiao-18
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-tianqitubiao-19"></span>
            <div class="name">
              龙卷风
            </div>
            <div class="code-name">.icon-tianqitubiao-19
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-ku"></span>
            <div class="name">
              酷
            </div>
            <div class="code-name">.icon-ku
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-shengqi"></span>
            <div class="name">
              生气
            </div>
            <div class="code-name">.icon-shengqi
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-yousiliao"></span>
            <div class="name">
              又死了
            </div>
            <div class="code-name">.icon-yousiliao
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-en"></span>
            <div class="name">
              恩~
            </div>
            <div class="code-name">.icon-en
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-bushufu"></span>
            <div class="name">
              不舒服
            </div>
            <div class="code-name">.icon-bushufu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-bianbian"></span>
            <div class="name">
              便便
            </div>
            <div class="code-name">.icon-bianbian
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-fankun1"></span>
            <div class="name">
              犯困
            </div>
            <div class="code-name">.icon-fankun1
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-feiwen"></span>
            <div class="name">
              飞吻
            </div>
            <div class="code-name">.icon-feiwen
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-ganmao"></span>
            <div class="name">
              感冒
            </div>
            <div class="code-name">.icon-ganmao
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-huaixiao"></span>
            <div class="name">
              坏笑
            </div>
            <div class="code-name">.icon-huaixiao
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-liuhan"></span>
            <div class="name">
              流汗
            </div>
            <div class="code-name">.icon-liuhan
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-outu"></span>
            <div class="name">
              呕吐
            </div>
            <div class="code-name">.icon-outu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-keshui"></span>
            <div class="name">
              瞌睡
            </div>
            <div class="code-name">.icon-keshui
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-renzhe"></span>
            <div class="name">
              忍者
            </div>
            <div class="code-name">.icon-renzhe
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-santiaoxian"></span>
            <div class="name">
              三条线
            </div>
            <div class="code-name">.icon-santiaoxian
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-guaiwu"></span>
            <div class="name">
              怪物
            </div>
            <div class="code-name">.icon-guaiwu
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-shoushang"></span>
            <div class="name">
              受伤
            </div>
            <div class="code-name">.icon-shoushang
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-tianshi"></span>
            <div class="name">
              天使
            </div>
            <div class="code-name">.icon-tianshi
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-shuai"></span>
            <div class="name">
              衰
            </div>
            <div class="code-name">.icon-shuai
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-xianwen"></span>
            <div class="name">
              献吻
            </div>
            <div class="code-name">.icon-xianwen
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-xiaodiaodaya"></span>
            <div class="name">
              笑掉大牙
            </div>
            <div class="code-name">.icon-xiaodiaodaya
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-xiong"></span>
            <div class="name">
              凶
            </div>
            <div class="code-name">.icon-xiong
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-yiwen"></span>
            <div class="name">
              疑问
            </div>
            <div class="code-name">.icon-yiwen
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-yun"></span>
            <div class="name">
              晕
            </div>
            <div class="code-name">.icon-yun
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-liubixie"></span>
            <div class="name">
              流鼻血
            </div>
            <div class="code-name">.icon-liubixie
            </div>
          </li>
          
          <li class="dib">
            <span class="icon iconfont icon-shimo"></span>
            <div class="name">
              什么
            </div>
            <div class="code-name">.icon-shimo
            </div>
          </li>
          
        </ul>
        <div class="article markdown">
        <h2 id="font-class-">font-class 引用</h2>
        <hr>

        <p>font-class 是 Unicode 使用方式的一种变种，主要是解决 Unicode 书写不直观，语意不明确的问题。</p>
        <p>与 Unicode 使用方式相比，具有如下特点：</p>
        <ul>
          <li>兼容性良好，支持 IE8+，及所有现代浏览器。</li>
          <li>相比于 Unicode 语意明确，书写更直观。可以很容易分辨这个 icon 是什么。</li>
          <li>因为使用 class 来定义图标，所以当要替换图标时，只需要修改 class 里面的 Unicode 引用。</li>
          <li>不过因为本质上还是使用的字体，所以多色图标还是不支持的。</li>
        </ul>
        <p>使用步骤如下：</p>
        <h3 id="-fontclass-">第一步：引入项目下面生成的 fontclass 代码：</h3>
<pre><code class="language-html">&lt;link rel="stylesheet" href="./iconfont.css"&gt;
</code></pre>
        <h3 id="-">第二步：挑选相应图标并获取类名，应用于页面：</h3>
<pre><code class="language-html">&lt;span class="iconfont icon--xxx"&gt;&lt;/span&gt;
</code></pre>
        <blockquote>
          <p>"
            iconfont" 是你项目下的 font-family。可以通过编辑项目查看，默认是 "iconfont"。</p>
        </blockquote>
      </div>
      </div>
      <div class="content symbol">
          <ul class="icon_lists dib-box">
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-dayu"></use>
                </svg>
                <div class="name">大雨-天气</div>
                <div class="code-name">#icon-dayu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-duoyun"></use>
                </svg>
                <div class="name">多云-天气</div>
                <div class="code-name">#icon-duoyun</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-leidian"></use>
                </svg>
                <div class="name">雷电-天气</div>
                <div class="code-name">#icon-leidian</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-qing"></use>
                </svg>
                <div class="name">晴-天气</div>
                <div class="code-name">#icon-qing</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-xiaoyu"></use>
                </svg>
                <div class="name">小雨-天气</div>
                <div class="code-name">#icon-xiaoyu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-xue"></use>
                </svg>
                <div class="name">雪-天气</div>
                <div class="code-name">#icon-xue</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-yintian"></use>
                </svg>
                <div class="name">阴天-天气</div>
                <div class="code-name">#icon-yintian</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-shenpi"></use>
                </svg>
                <div class="name">审批</div>
                <div class="code-name">#icon-shenpi</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mimazhongzhi"></use>
                </svg>
                <div class="name">密码重置</div>
                <div class="code-name">#icon-mimazhongzhi</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-yijingfabu"></use>
                </svg>
                <div class="name">已经发布</div>
                <div class="code-name">#icon-yijingfabu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-shuzi0"></use>
                </svg>
                <div class="name">数字0</div>
                <div class="code-name">#icon-shuzi0</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-shuzi1"></use>
                </svg>
                <div class="name">数字1</div>
                <div class="code-name">#icon-shuzi1</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-shuzi2"></use>
                </svg>
                <div class="name">数字2</div>
                <div class="code-name">#icon-shuzi2</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-shuzi3"></use>
                </svg>
                <div class="name">数字3</div>
                <div class="code-name">#icon-shuzi3</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-shuzi4"></use>
                </svg>
                <div class="name">数字4</div>
                <div class="code-name">#icon-shuzi4</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-shuzi5"></use>
                </svg>
                <div class="name">数字5</div>
                <div class="code-name">#icon-shuzi5</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-shuzi6"></use>
                </svg>
                <div class="name">数字6</div>
                <div class="code-name">#icon-shuzi6</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-shuzi7"></use>
                </svg>
                <div class="name">数字7</div>
                <div class="code-name">#icon-shuzi7</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-shuzi8"></use>
                </svg>
                <div class="name">数字8</div>
                <div class="code-name">#icon-shuzi8</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-shuzi9"></use>
                </svg>
                <div class="name">数字9</div>
                <div class="code-name">#icon-shuzi9</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-chenggong"></use>
                </svg>
                <div class="name">成功</div>
                <div class="code-name">#icon-chenggong</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-dizhi"></use>
                </svg>
                <div class="name">地址</div>
                <div class="code-name">#icon-dizhi</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-dianzanb"></use>
                </svg>
                <div class="name">点赞-b</div>
                <div class="code-name">#icon-dianzanb</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-dianzanjihuob"></use>
                </svg>
                <div class="name">点赞(激活)-b</div>
                <div class="code-name">#icon-dianzanjihuob</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-redu"></use>
                </svg>
                <div class="name">热度</div>
                <div class="code-name">#icon-redu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-no"></use>
                </svg>
                <div class="name">no</div>
                <div class="code-name">#icon-no</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-ok"></use>
                </svg>
                <div class="name">ok</div>
                <div class="code-name">#icon-ok</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-pass-2-copy"></use>
                </svg>
                <div class="name">审核通过</div>
                <div class="code-name">#icon-pass-2-copy</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-dengdaishenhe"></use>
                </svg>
                <div class="name">等待审核</div>
                <div class="code-name">#icon-dengdaishenhe</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-dengdaishouquan"></use>
                </svg>
                <div class="name">等待授权</div>
                <div class="code-name">#icon-dengdaishouquan</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-shenhebohui"></use>
                </svg>
                <div class="name">审核驳回</div>
                <div class="code-name">#icon-shenhebohui</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-shouquanbohui"></use>
                </svg>
                <div class="name">授权驳回</div>
                <div class="code-name">#icon-shouquanbohui</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-tianqi-baoyuzhuandabaoyu"></use>
                </svg>
                <div class="name">天气-暴雨转大暴雨</div>
                <div class="code-name">#icon-tianqi-baoyuzhuandabaoyu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-tianqi-baoyu"></use>
                </svg>
                <div class="name">天气-暴雨</div>
                <div class="code-name">#icon-tianqi-baoyu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-tianqi-daxuezhuanbaoxue"></use>
                </svg>
                <div class="name">天气-大雪转暴雪</div>
                <div class="code-name">#icon-tianqi-daxuezhuanbaoxue</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-tianqi-daxue"></use>
                </svg>
                <div class="name">天气-大雪</div>
                <div class="code-name">#icon-tianqi-daxue</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-tianqi-dabaoyu"></use>
                </svg>
                <div class="name">天气-大暴雨</div>
                <div class="code-name">#icon-tianqi-dabaoyu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-tianqi-baoxue"></use>
                </svg>
                <div class="name">天气-暴雪</div>
                <div class="code-name">#icon-tianqi-baoxue</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-tianqi-dayu"></use>
                </svg>
                <div class="name">天气-大雨</div>
                <div class="code-name">#icon-tianqi-dayu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-tianqi-fengxiang"></use>
                </svg>
                <div class="name">天气-风向</div>
                <div class="code-name">#icon-tianqi-fengxiang</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-tianqi-duoyun"></use>
                </svg>
                <div class="name">天气-多云</div>
                <div class="code-name">#icon-tianqi-duoyun</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-tianqi-dayuzhuanbaoyu"></use>
                </svg>
                <div class="name">天气-大雨转暴雨</div>
                <div class="code-name">#icon-tianqi-dayuzhuanbaoyu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-tianqi-dongyu"></use>
                </svg>
                <div class="name">天气-冻雨</div>
                <div class="code-name">#icon-tianqi-dongyu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-tianqi-dayuzhuantedabaoyu"></use>
                </svg>
                <div class="name">天气-大雨转特大暴雨</div>
                <div class="code-name">#icon-tianqi-dayuzhuantedabaoyu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-tianqi-fuchen"></use>
                </svg>
                <div class="name">天气-浮尘</div>
                <div class="code-name">#icon-tianqi-fuchen</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-tianqi-leiyubingbao"></use>
                </svg>
                <div class="name">天气-雷雨冰雹</div>
                <div class="code-name">#icon-tianqi-leiyubingbao</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-tianqi-qing"></use>
                </svg>
                <div class="name">天气-晴</div>
                <div class="code-name">#icon-tianqi-qing</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-tianqi-leizhenyu"></use>
                </svg>
                <div class="name">天气-雷阵雨</div>
                <div class="code-name">#icon-tianqi-leizhenyu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-tianqi-tedabaoyu"></use>
                </svg>
                <div class="name">天气-特大暴雨</div>
                <div class="code-name">#icon-tianqi-tedabaoyu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-tianqi-shachenbao"></use>
                </svg>
                <div class="name">天气-沙尘暴</div>
                <div class="code-name">#icon-tianqi-shachenbao</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-tianqi-tedashachenbao"></use>
                </svg>
                <div class="name">天气-特大沙尘暴</div>
                <div class="code-name">#icon-tianqi-tedashachenbao</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-tianqi-wumai"></use>
                </svg>
                <div class="name">天气-雾霾</div>
                <div class="code-name">#icon-tianqi-wumai</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-tianqi-wu"></use>
                </svg>
                <div class="name">天气-雾</div>
                <div class="code-name">#icon-tianqi-wu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-tianqi-xiaoxue"></use>
                </svg>
                <div class="name">天气-小雪</div>
                <div class="code-name">#icon-tianqi-xiaoxue</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-tianqi-xiaoyu"></use>
                </svg>
                <div class="name">天气-小雨</div>
                <div class="code-name">#icon-tianqi-xiaoyu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-tianqi-xiaoxuezhuanzhongxue"></use>
                </svg>
                <div class="name">天气-小雪转中雪</div>
                <div class="code-name">#icon-tianqi-xiaoxuezhuanzhongxue</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-tianqi-yin"></use>
                </svg>
                <div class="name">天气-阴</div>
                <div class="code-name">#icon-tianqi-yin</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-tianqi-xue"></use>
                </svg>
                <div class="name">天气-雪</div>
                <div class="code-name">#icon-tianqi-xue</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-tianqi-yu"></use>
                </svg>
                <div class="name">天气-雨</div>
                <div class="code-name">#icon-tianqi-yu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-tianqi-xiaoyuzhuanzhongyu"></use>
                </svg>
                <div class="name">天气-小雨转中雨</div>
                <div class="code-name">#icon-tianqi-xiaoyuzhuanzhongyu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-tianqi-yujiaxue"></use>
                </svg>
                <div class="name">天气-雨夹雪</div>
                <div class="code-name">#icon-tianqi-yujiaxue</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-tianqi-yangsha"></use>
                </svg>
                <div class="name">天气-扬沙</div>
                <div class="code-name">#icon-tianqi-yangsha</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-tianqi-zhenxue"></use>
                </svg>
                <div class="name">天气-阵雪</div>
                <div class="code-name">#icon-tianqi-zhenxue</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-tianqi-zhongxue"></use>
                </svg>
                <div class="name">天气-中雪</div>
                <div class="code-name">#icon-tianqi-zhongxue</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-tianqi-zhenyu"></use>
                </svg>
                <div class="name">天气-阵雨</div>
                <div class="code-name">#icon-tianqi-zhenyu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-tianqi-zhongyu"></use>
                </svg>
                <div class="name">天气-中雨</div>
                <div class="code-name">#icon-tianqi-zhongyu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-tianqi-zhongxuezhuandaxue"></use>
                </svg>
                <div class="name">天气-中雪转大雪</div>
                <div class="code-name">#icon-tianqi-zhongxuezhuandaxue</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-tianqi-zhongyuzhuandayu"></use>
                </svg>
                <div class="name">天气-中雨转大雨</div>
                <div class="code-name">#icon-tianqi-zhongyuzhuandayu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-tianqi-"></use>
                </svg>
                <div class="name">天气-6</div>
                <div class="code-name">#icon-tianqi-</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-jiangbei-"></use>
                </svg>
                <div class="name">奖杯1-1</div>
                <div class="code-name">#icon-jiangbei-</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-jiangbei-1"></use>
                </svg>
                <div class="name">奖杯1-2</div>
                <div class="code-name">#icon-jiangbei-1</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-jiangbei-2"></use>
                </svg>
                <div class="name">奖杯1-3</div>
                <div class="code-name">#icon-jiangbei-2</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-jiangbei-3"></use>
                </svg>
                <div class="name">奖杯2-1</div>
                <div class="code-name">#icon-jiangbei-3</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-jiangbei-4"></use>
                </svg>
                <div class="name">奖杯2-2</div>
                <div class="code-name">#icon-jiangbei-4</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-jiangbei-5"></use>
                </svg>
                <div class="name">奖杯2-3</div>
                <div class="code-name">#icon-jiangbei-5</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-jiangbei-6"></use>
                </svg>
                <div class="name">奖杯3-1</div>
                <div class="code-name">#icon-jiangbei-6</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-jiangbei-7"></use>
                </svg>
                <div class="name">奖杯3-2</div>
                <div class="code-name">#icon-jiangbei-7</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-jiangbei-8"></use>
                </svg>
                <div class="name">奖杯3-3</div>
                <div class="code-name">#icon-jiangbei-8</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-jiangbei-9"></use>
                </svg>
                <div class="name">奖杯4-1</div>
                <div class="code-name">#icon-jiangbei-9</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-jiangbei-10"></use>
                </svg>
                <div class="name">奖杯4-2</div>
                <div class="code-name">#icon-jiangbei-10</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-jiangbei-11"></use>
                </svg>
                <div class="name">奖杯4-3</div>
                <div class="code-name">#icon-jiangbei-11</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-jiangbei-12"></use>
                </svg>
                <div class="name">奖杯5-1</div>
                <div class="code-name">#icon-jiangbei-12</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-jiangbei-13"></use>
                </svg>
                <div class="name">奖杯5-2</div>
                <div class="code-name">#icon-jiangbei-13</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-jiangbei-14"></use>
                </svg>
                <div class="name">奖杯5-3</div>
                <div class="code-name">#icon-jiangbei-14</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-jiangbei-15"></use>
                </svg>
                <div class="name">奖杯6-1</div>
                <div class="code-name">#icon-jiangbei-15</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-jiangbei-16"></use>
                </svg>
                <div class="name">奖杯6-2</div>
                <div class="code-name">#icon-jiangbei-16</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-jiangbei-17"></use>
                </svg>
                <div class="name">奖杯6-3</div>
                <div class="code-name">#icon-jiangbei-17</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-jiangbei-18"></use>
                </svg>
                <div class="name">奖杯7-1</div>
                <div class="code-name">#icon-jiangbei-18</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-jiangbei-19"></use>
                </svg>
                <div class="name">奖杯7-2</div>
                <div class="code-name">#icon-jiangbei-19</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-jiangbei-20"></use>
                </svg>
                <div class="name">奖杯7-3</div>
                <div class="code-name">#icon-jiangbei-20</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-AItubiao"></use>
                </svg>
                <div class="name">AI图标</div>
                <div class="code-name">#icon-AItubiao</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-GIFtubiao"></use>
                </svg>
                <div class="name">GIF图标</div>
                <div class="code-name">#icon-GIFtubiao</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-doctubiao"></use>
                </svg>
                <div class="name">doc图标</div>
                <div class="code-name">#icon-doctubiao</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-bmptubiao"></use>
                </svg>
                <div class="name">bmp图标</div>
                <div class="code-name">#icon-bmptubiao</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-AVItubiao"></use>
                </svg>
                <div class="name">AVI图标</div>
                <div class="code-name">#icon-AVItubiao</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-movtubiao"></use>
                </svg>
                <div class="name">mov图标</div>
                <div class="code-name">#icon-movtubiao</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-MPtubiao"></use>
                </svg>
                <div class="name">MP4图标</div>
                <div class="code-name">#icon-MPtubiao</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-pdftubiao"></use>
                </svg>
                <div class="name">pdf图标</div>
                <div class="code-name">#icon-pdftubiao</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-PRtubiao"></use>
                </svg>
                <div class="name">PR图标</div>
                <div class="code-name">#icon-PRtubiao</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-htmltubiao"></use>
                </svg>
                <div class="name">html图标</div>
                <div class="code-name">#icon-htmltubiao</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-psdtubiao"></use>
                </svg>
                <div class="name">psd图标</div>
                <div class="code-name">#icon-psdtubiao</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-RARtubiao"></use>
                </svg>
                <div class="name">RAR图标</div>
                <div class="code-name">#icon-RARtubiao</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-MPtubiao1"></use>
                </svg>
                <div class="name">MP3图标</div>
                <div class="code-name">#icon-MPtubiao1</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-ppttubiao"></use>
                </svg>
                <div class="name">ppt图标</div>
                <div class="code-name">#icon-ppttubiao</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-TIFtubiao"></use>
                </svg>
                <div class="name">TIF图标</div>
                <div class="code-name">#icon-TIFtubiao</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-CDRtubiao"></use>
                </svg>
                <div class="name">CDR图标</div>
                <div class="code-name">#icon-CDRtubiao</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-svgtubiao"></use>
                </svg>
                <div class="name">svg图标</div>
                <div class="code-name">#icon-svgtubiao</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-EPStubiao"></use>
                </svg>
                <div class="name">EPS图标</div>
                <div class="code-name">#icon-EPStubiao</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-EXEtubiao"></use>
                </svg>
                <div class="name">EXE图标</div>
                <div class="code-name">#icon-EXEtubiao</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-ZIPtubiao"></use>
                </svg>
                <div class="name">ZIP图标</div>
                <div class="code-name">#icon-ZIPtubiao</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-a"></use>
                </svg>
                <div class="name">啊</div>
                <div class="code-name">#icon-a</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-bizui"></use>
                </svg>
                <div class="name">闭嘴</div>
                <div class="code-name">#icon-bizui</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-baiyan"></use>
                </svg>
                <div class="name">白眼</div>
                <div class="code-name">#icon-baiyan</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-aixin"></use>
                </svg>
                <div class="name">爱心</div>
                <div class="code-name">#icon-aixin</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-dajing"></use>
                </svg>
                <div class="name">大惊</div>
                <div class="code-name">#icon-dajing</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-ziya"></use>
                </svg>
                <div class="name">呲牙</div>
                <div class="code-name">#icon-ziya</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-daxiao"></use>
                </svg>
                <div class="name">大笑</div>
                <div class="code-name">#icon-daxiao</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-esi"></use>
                </svg>
                <div class="name">饿死</div>
                <div class="code-name">#icon-esi</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-fadai"></use>
                </svg>
                <div class="name">发呆</div>
                <div class="code-name">#icon-fadai</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-fankun"></use>
                </svg>
                <div class="name">犯困</div>
                <div class="code-name">#icon-fankun</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-ganga"></use>
                </svg>
                <div class="name">尴尬</div>
                <div class="code-name">#icon-ganga</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-fennu"></use>
                </svg>
                <div class="name">愤怒</div>
                <div class="code-name">#icon-fennu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-hanyan"></use>
                </svg>
                <div class="name">汗颜</div>
                <div class="code-name">#icon-hanyan</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-jingkong"></use>
                </svg>
                <div class="name">惊恐</div>
                <div class="code-name">#icon-jingkong</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-haochi"></use>
                </svg>
                <div class="name">好吃</div>
                <div class="code-name">#icon-haochi</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-emo"></use>
                </svg>
                <div class="name">恶魔</div>
                <div class="code-name">#icon-emo</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-jingsong"></use>
                </svg>
                <div class="name">惊悚</div>
                <div class="code-name">#icon-jingsong</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-jingya"></use>
                </svg>
                <div class="name">惊讶</div>
                <div class="code-name">#icon-jingya</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-kaixin"></use>
                </svg>
                <div class="name">开心</div>
                <div class="code-name">#icon-kaixin</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-lengku"></use>
                </svg>
                <div class="name">冷酷</div>
                <div class="code-name">#icon-lengku</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-danao"></use>
                </svg>
                <div class="name">大闹</div>
                <div class="code-name">#icon-danao</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-liukoushui"></use>
                </svg>
                <div class="name">流口水</div>
                <div class="code-name">#icon-liukoushui</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-liulei"></use>
                </svg>
                <div class="name">流泪</div>
                <div class="code-name">#icon-liulei</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mengbi"></use>
                </svg>
                <div class="name">懵逼</div>
                <div class="code-name">#icon-mengbi</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-mianwubiaoqing"></use>
                </svg>
                <div class="name">面无表情</div>
                <div class="code-name">#icon-mianwubiaoqing</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-nanguo"></use>
                </svg>
                <div class="name">难过</div>
                <div class="code-name">#icon-nanguo</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-shuizhuo"></use>
                </svg>
                <div class="name">睡着</div>
                <div class="code-name">#icon-shuizhuo</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-taoyan"></use>
                </svg>
                <div class="name">讨厌</div>
                <div class="code-name">#icon-taoyan</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-tanchi"></use>
                </svg>
                <div class="name">贪吃</div>
                <div class="code-name">#icon-tanchi</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-siliao"></use>
                </svg>
                <div class="name">死了</div>
                <div class="code-name">#icon-siliao</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-tiaopi"></use>
                </svg>
                <div class="name">调皮</div>
                <div class="code-name">#icon-tiaopi</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-xiaochulei"></use>
                </svg>
                <div class="name">笑出泪</div>
                <div class="code-name">#icon-xiaochulei</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-wuliao"></use>
                </svg>
                <div class="name">无聊</div>
                <div class="code-name">#icon-wuliao</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-xingxingyan"></use>
                </svg>
                <div class="name">星星眼</div>
                <div class="code-name">#icon-xingxingyan</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-xieyan"></use>
                </svg>
                <div class="name">斜眼</div>
                <div class="code-name">#icon-xieyan</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-xiasi"></use>
                </svg>
                <div class="name">吓死</div>
                <div class="code-name">#icon-xiasi</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-xiaolian"></use>
                </svg>
                <div class="name">笑脸</div>
                <div class="code-name">#icon-xiaolian</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-tianqitubiao-"></use>
                </svg>
                <div class="name">晴天</div>
                <div class="code-name">#icon-tianqitubiao-</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-tianqitubiao-1"></use>
                </svg>
                <div class="name">沙尘暴</div>
                <div class="code-name">#icon-tianqitubiao-1</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-tianqitubiao-2"></use>
                </svg>
                <div class="name">多云</div>
                <div class="code-name">#icon-tianqitubiao-2</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-tianqitubiao-3"></use>
                </svg>
                <div class="name">小雨</div>
                <div class="code-name">#icon-tianqitubiao-3</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-tianqitubiao-4"></use>
                </svg>
                <div class="name">阴天</div>
                <div class="code-name">#icon-tianqitubiao-4</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-tianqitubiao-5"></use>
                </svg>
                <div class="name">闪电</div>
                <div class="code-name">#icon-tianqitubiao-5</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-tianqitubiao-6"></use>
                </svg>
                <div class="name">月亮</div>
                <div class="code-name">#icon-tianqitubiao-6</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-tianqitubiao-7"></use>
                </svg>
                <div class="name">雾</div>
                <div class="code-name">#icon-tianqitubiao-7</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-tianqitubiao-8"></use>
                </svg>
                <div class="name">太阳雨</div>
                <div class="code-name">#icon-tianqitubiao-8</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-tianqitubiao-9"></use>
                </svg>
                <div class="name">彩虹</div>
                <div class="code-name">#icon-tianqitubiao-9</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-tianqitubiao-10"></use>
                </svg>
                <div class="name">冰雹</div>
                <div class="code-name">#icon-tianqitubiao-10</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-tianqitubiao-11"></use>
                </svg>
                <div class="name">大雪</div>
                <div class="code-name">#icon-tianqitubiao-11</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-tianqitubiao-12"></use>
                </svg>
                <div class="name">小雪</div>
                <div class="code-name">#icon-tianqitubiao-12</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-tianqitubiao-13"></use>
                </svg>
                <div class="name">晴天</div>
                <div class="code-name">#icon-tianqitubiao-13</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-tianqitubiao-14"></use>
                </svg>
                <div class="name">晴天</div>
                <div class="code-name">#icon-tianqitubiao-14</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-tianqitubiao-15"></use>
                </svg>
                <div class="name">大雨</div>
                <div class="code-name">#icon-tianqitubiao-15</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-tianqitubiao-16"></use>
                </svg>
                <div class="name">中雨</div>
                <div class="code-name">#icon-tianqitubiao-16</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-tianqitubiao-17"></use>
                </svg>
                <div class="name">雾霾</div>
                <div class="code-name">#icon-tianqitubiao-17</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-tianqitubiao-18"></use>
                </svg>
                <div class="name">夜空</div>
                <div class="code-name">#icon-tianqitubiao-18</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-tianqitubiao-19"></use>
                </svg>
                <div class="name">龙卷风</div>
                <div class="code-name">#icon-tianqitubiao-19</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-ku"></use>
                </svg>
                <div class="name">酷</div>
                <div class="code-name">#icon-ku</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-shengqi"></use>
                </svg>
                <div class="name">生气</div>
                <div class="code-name">#icon-shengqi</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-yousiliao"></use>
                </svg>
                <div class="name">又死了</div>
                <div class="code-name">#icon-yousiliao</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-en"></use>
                </svg>
                <div class="name">恩~</div>
                <div class="code-name">#icon-en</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-bushufu"></use>
                </svg>
                <div class="name">不舒服</div>
                <div class="code-name">#icon-bushufu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-bianbian"></use>
                </svg>
                <div class="name">便便</div>
                <div class="code-name">#icon-bianbian</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-fankun1"></use>
                </svg>
                <div class="name">犯困</div>
                <div class="code-name">#icon-fankun1</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-feiwen"></use>
                </svg>
                <div class="name">飞吻</div>
                <div class="code-name">#icon-feiwen</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-ganmao"></use>
                </svg>
                <div class="name">感冒</div>
                <div class="code-name">#icon-ganmao</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-huaixiao"></use>
                </svg>
                <div class="name">坏笑</div>
                <div class="code-name">#icon-huaixiao</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-liuhan"></use>
                </svg>
                <div class="name">流汗</div>
                <div class="code-name">#icon-liuhan</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-outu"></use>
                </svg>
                <div class="name">呕吐</div>
                <div class="code-name">#icon-outu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-keshui"></use>
                </svg>
                <div class="name">瞌睡</div>
                <div class="code-name">#icon-keshui</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-renzhe"></use>
                </svg>
                <div class="name">忍者</div>
                <div class="code-name">#icon-renzhe</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-santiaoxian"></use>
                </svg>
                <div class="name">三条线</div>
                <div class="code-name">#icon-santiaoxian</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-guaiwu"></use>
                </svg>
                <div class="name">怪物</div>
                <div class="code-name">#icon-guaiwu</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-shoushang"></use>
                </svg>
                <div class="name">受伤</div>
                <div class="code-name">#icon-shoushang</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-tianshi"></use>
                </svg>
                <div class="name">天使</div>
                <div class="code-name">#icon-tianshi</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-shuai"></use>
                </svg>
                <div class="name">衰</div>
                <div class="code-name">#icon-shuai</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-xianwen"></use>
                </svg>
                <div class="name">献吻</div>
                <div class="code-name">#icon-xianwen</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-xiaodiaodaya"></use>
                </svg>
                <div class="name">笑掉大牙</div>
                <div class="code-name">#icon-xiaodiaodaya</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-xiong"></use>
                </svg>
                <div class="name">凶</div>
                <div class="code-name">#icon-xiong</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-yiwen"></use>
                </svg>
                <div class="name">疑问</div>
                <div class="code-name">#icon-yiwen</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-yun"></use>
                </svg>
                <div class="name">晕</div>
                <div class="code-name">#icon-yun</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-liubixie"></use>
                </svg>
                <div class="name">流鼻血</div>
                <div class="code-name">#icon-liubixie</div>
            </li>
          
            <li class="dib">
                <svg class="icon svg-icon" aria-hidden="true">
                  <use xlink:href="#icon-shimo"></use>
                </svg>
                <div class="name">什么</div>
                <div class="code-name">#icon-shimo</div>
            </li>
          
          </ul>
          <div class="article markdown">
          <h2 id="symbol-">Symbol 引用</h2>
          <hr>

          <p>这是一种全新的使用方式，应该说这才是未来的主流，也是平台目前推荐的用法。相关介绍可以参考这篇<a href="">文章</a>
            这种用法其实是做了一个 SVG 的集合，与另外两种相比具有如下特点：</p>
          <ul>
            <li>支持多色图标了，不再受单色限制。</li>
            <li>通过一些技巧，支持像字体那样，通过 <code>font-size</code>, <code>color</code> 来调整样式。</li>
            <li>兼容性较差，支持 IE9+，及现代浏览器。</li>
            <li>浏览器渲染 SVG 的性能一般，还不如 png。</li>
          </ul>
          <p>使用步骤如下：</p>
          <h3 id="-symbol-">第一步：引入项目下面生成的 symbol 代码：</h3>
<pre><code class="language-html">&lt;script src="./iconfont.js"&gt;&lt;/script&gt;
</code></pre>
          <h3 id="-css-">第二步：加入通用 CSS 代码（引入一次就行）：</h3>
<pre><code class="language-html">&lt;style&gt;
.icon {
  width: 1em;
  height: 1em;
  vertical-align: -0.15em;
  fill: currentColor;
  overflow: hidden;
}
&lt;/style&gt;
</code></pre>
          <h3 id="-">第三步：挑选相应图标并获取类名，应用于页面：</h3>
<pre><code class="language-html">&lt;svg class="icon" aria-hidden="true"&gt;
  &lt;use xlink:href="#icon-xxx"&gt;&lt;/use&gt;
&lt;/svg&gt;
</code></pre>
          </div>
      </div>

    </div>
  </div>
  <script>
  $(document).ready(function () {
      $('.tab-container .content:first').show()

      $('#tabs li').click(function (e) {
        var tabContent = $('.tab-container .content')
        var index = $(this).index()

        if ($(this).hasClass('active')) {
          return
        } else {
          $('#tabs li').removeClass('active')
          $(this).addClass('active')

          tabContent.hide().eq(index).fadeIn()
        }
      })
    })
  </script>
</body>
</html>
